<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8" />
	<title>Layabox首页</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
	<link rel="stylesheet" type="text/css" href="" />
	<link rel="stylesheet" type="text/css" href="css/common.css"/>
	<link rel="stylesheet" type="text/css" href="css/index.css"/>
	<link rel="stylesheet" type="text/css" href="//at.alicdn.com/t/font_813660_rupu5fhjbmc.css"/>
	<script src="js/jquery-2.1.0.js"></script>
	<script src="js/bootstrap.min.js"></script>
</head>
<body>
		<!--顶部导航栏制作-->
		<header class="public-header">
			<!--导航栏制作-->
			<nav class="navbar-default navbar-inverse">
				<div class="container">
					<!-- Brand and toggle get grouped for better mobile display -->
					<div class="navbar-header">
						<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
					        <span class="sr-only">Toggle navigation</span>
					        <span class="icon-bar"></span>
					        <span class="icon-bar"></span>
					        <span class="icon-bar"></span>
					    </button>
					<a class="navbar-brand" href="#"></a>
					</div>
					<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
						<ul class="nav navbar-nav">
							<li class="active">
								<a href="index.html">首页<span class="sr-only">(current)</span></a>
							</li>
							<li>
								<a href="layafamily.html">Laya家族</a>
							</li>
							<li>
								<a href="game.html">游戏</a>
							</li>
							<li>
								<a href="#">新闻动态</a>
							</li>
							<li>
								<a href="#">开发者中心</a>
							</li>
							<li>
								<a href="#">开发者 社区</a>
							</li>
							<li>
								<a href="#">开放平台</a>
							</li>
							<li>
								<a href="#">关于我们</a>
							</li>
						</ul>
						<ul class="nav navbar-nav navbar-right">
								<li class="dropdown">
								<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Language <span class="caret"></span></a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">English</a>
									</li>
									<li>
										<a href="#">中文</a>
									</li>
									<li>
										<a href="#">日本語</a>
									</li>
									<!--<li role="separator" class="divider"></li>-->
									<!--<li>
										<a href="#">Separated link</a>
									</li>-->
								</ul>
							</li>
						</ul>
					</div>
					<!-- /.navbar-collapse -->
				</div
				<!-- /.container-fluid -->
			</nav>
			<!--导航栏制作-->
		</header>
		<!--顶部导航栏制作-->
		<section>
			<!--banner图制作-->
			<div class="banner">
				<img src="img/html5game.png" class="img-responsive center-block"/>
			</div>
			<!--banner图制作-->
			<!--layaflash引擎-->
			<div class="layaflash">
				<div class="container">
				<div>
						<h1>LayaFlash 引擎</h1>
						<p>让Flash技术变成开发HTML5产品的利器</p>
					</div>
				<div class="col-xs-12 col-sm-9 row layaflash-l">
				<div class="col-md-6 flash-wrap clearfix row">
					<div class="col-xs-3 flash-icon">
					    <img src="img/flash-l-1.png">
					</div>
					<div class="introduce col-xs-9">
					    <h4 class="media-heading">快速Flash产品转换</h4>
					    <p>Flash页游\手游仅需1个人7天即可转换为HTML5和APP游戏</p>
					</div>
				</div><!--1-->
				<div class="col-md-6 flash-wrap clearfix row">
					<div class="col-xs-3 flash-icon">
					    <img src="img/flash-l-2.png" alt="">
					</div>
					<div class="introduce col-xs-9">
					    <h4 class="media-heading">LayaFlash IDE</h4>
					    <p>支持代码编译、调试、压缩与混淆加密、资源转换、在线文档等功能</p>
					</div>
				</div><!--2-->
				<div class="col-md-6 flash-wrap clearfix row">
					<div class="col-xs-3 flash-icon">
					    <img src="img/flash-l-3.png" alt="">
					</div>
					<div class="introduce col-xs-9">
					    <h4 class="media-heading">HTML5零学习成本</h4>
					    <p>AS3开发者可直接使用Flash开源框架和工具链进行开发HTML5</p>
					</div>
				</div><!--3-->
				<div class="col-md-6 flash-wrap clearfix row">
					<div class="col-xs-3 flash-icon">
					    <img src="img/flash-l-4.png" alt="">
					</div>
					<div class="introduce col-xs-9">
					    <h4 class="media-heading">性能媲美APP</h4>
					    <p>LayaFlash引擎的重度游戏已运行于QQ空间等平台，性能媲美APP</p>
					</div>
				</div><!--4-->
				</div>
				<div class="layaflash-r col-md-3 hidden-xs hidden-sm">
					<img src="img/flash-r.png"/>
				</div>
			</div>
			</div>
			<!--layaflash引擎-->
			<!--layabox优势-->
			<div class="superiority">
				<div class="container">
					<div class="col-sm-5 thumbnail">
						<img src="img/air-bar.jpg"/>
					</div>
					<div class="col-xs-12 col-sm-7 row">
						<h1>Layabox 优势</h1>
						<div class="superiority-text clearfix">
						<div class="col-xs-3 superiority-icon">
							    <img src="img/ad01.png" alt="">
							</div>
						<div class="introduce col-xs-9">
							    <p>快速上手，Flash程序员3小时掌握HTML5开发</p>
						</div>
						</div><!--1-->
						<div class="superiority-text clearfix">
						<div class="col-xs-3 superiority-icon">
							    <img src="img/ad02.png" alt="">
							</div>
						<div class="introduce col-xs-9">
							    <p>4年优化打磨，LayaPlayer运行器性能媲美APP</p>
						</div>
						</div><!--2-->
						<div class="superiority-text clearfix">
						<div class="col-xs-3 superiority-icon">
							    <img src="img/ad03.png" alt="">
							</div>
						<div class="introduce col-xs-9">
							    <p>超5亿的LayaPlayer移动设备安装量帮助CP发行</p>
						</div>
						</div><!--3-->
						<div class="superiority-text clearfix">
						<div class="col-xs-3 superiority-icon">
							    <img src="img/ad04.png" alt="">
							</div>
						<div class="introduce col-xs-9">
							    <p>使用LayaFlash开发大型HTML5游戏的企业超100家</p>
						</div>
						</div><!--4-->
					</div>
				</div>
			</div>
			<!--layabox优势-->
			<!--laya产品-->
			<div class="product">
				<div class="container">
				<h1>Layabox产品家族</h1>	
				<div class="row">
				<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro001.png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> 核心库仅100K左右的新一代HTML5引擎，支
							持AS3\TS\JS语言开发，支持2D\3D，非运行
							<!--器模式下性能媲美APP。-->
					    </p>
					  </div>
					</div><!--1-->
				<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro002.png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> Layabox发行业务，通过在H5产业链中的技术桥梁优势，帮助CP获得流量支持。
					    </p>
					  </div>
					</div><!--2-->
				<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro003.png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> Layabox发行业务，通过在H5产业链中的技术桥梁优势，帮助CP获得流量支持。
					    </p>
					  </div>
					</div><!--3-->
					<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro004.png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> Layabox发行业务，通过在H5产业链中的技术桥梁优势，帮助CP获得流量支持。
					    </p>
					  </div>
					</div><!--4-->
					<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro005.png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> Layabox发行业务，通过在H5产业链中的技术桥梁优势，帮助CP获得流量支持。
					    </p>
					  </div>
					</div><!--5-->
					<div class="media col-sm-6">
					  <div class="media-left col-xs-12 col-sm-3">
					    <div>
					      <img class="media-object" src="img/pro006 (1).png" alt="">
					    </div>
					  </div>
					  <div class="col-xs-12 col-sm-9">
					    <h4 class="media-heading">LayaAir</h4>
					    <p> Layabox发行业务，通过在H5产业链中的技术桥梁优势，帮助CP获得流量支持。
					    </p>
					  </div>
					</div><!--6-->
				</div>
				</div>
			</div>
			<!--laya产品-->
			<!--laya精彩游戏-->
			<div class="layagame">
				<div class="container">
					<div class="clearfix">
					<h1 class="col-sm-10">采用Layabox引擎的精彩游戏</h1>	
					<a href="#" class="hidden-xs col-sm-2">更多</a>
					</div>
					<div class="col-md-5 thumbnail">
						<video width="270px" height="145.94px" controls="controls" poster="img/video.jpg">
							<source src="video/layabox_product.mp4" type="video/mp4"></source>
							<source src="" type="video/ogg"></source>
							<source src="" type="video/webm"></source>
							当前浏览器不支持 video直接播放
						</video>
					</div><!--视频播放-->
					<div class="col-md-7 wrap">
						<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100713908.jpg" alt="猎刃2">
					     	 猎刃2
					    </div>
	  					</div><!--猎刃2-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/1448595493706470.png" alt="上吧主公">
					      	上吧主公
					    </div>
	  					</div><!--上吧主公-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100411595.png" alt="醉西游">
					      	醉西游
					    </div>
	  					</div><!--醉西游-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100353560.png" alt="魔卡幻想">
					      	魔卡幻想
					    </div>
	  					</div><!--魔卡幻想-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/1448595739820321.png" alt="超能战队">
					      	超能战队
					    </div>
	  					</div><!--超能战队-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/1448596805527127.png" alt="刀塔大菠萝">
					      	刀塔大菠萝
					    </div>
	  					</div><!--刀塔大菠萝-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100327918.png" alt="轰三国">
					      	轰三国
					    </div>
	  					</div><!--轰三国-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100427748.png" alt="迷你猎人">
					      	迷你猎人
					    </div>
	  					</div><!--迷你猎人-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/1448615195484288.png" alt="萌挂三国">
					      	萌挂三国
					    </div>
	  					</div><!--萌挂三国-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917095920748.png" alt="夺塔三国">
					      	夺塔三国
					    </div>
	  					</div><!--夺塔三国-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917095903153.png" alt="英雄争霸">
					      	英雄争霸
					    </div>
	  					</div><!--英雄争霸-->
	  					<div class="col-xs-4 col-sm-3 col-md-2">
					    <div class="thumbnail">
					      <img src="img/20150917100200350.png" alt="战争之门">
					      	战争之门
					    </div>
	  					</div><!--战争之梦-->
					</div>
				</div>
			</div>
			<!--laya精彩游戏-->
			<!--合作伙伴-->
			<div class="cooperation">
				<div class="container">
					<p>合作伙伴<span>(排序不分先后)</span></p>
				  	<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447667000986467.jpg" alt="qq空间">
				    </div>
  					</div><!--qq空间-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447667085837167.jpg" alt="qq浏览器">
				    </div>
  					</div><!--qq浏览器-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1448604372733640.jpg" alt="百度">
				    </div>
  					</div><!--百度-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447666979289519.jpg" alt="新浪微博">
				    </div>
  					</div><!--新浪微博-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447667022735949.jpg.png" alt="火速移动">
				    </div>
  					</div><!--火速移动-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447667046677762.jpg" alt="猎豹浏览器">
				    </div>
  					</div><!--猎豹浏览器-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1448604300406522.jpg" alt="爱游戏">
				    </div>
  					</div><!--爱游戏-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1448604354220485.jpg" alt="小沃">
				    </div>
  					</div><!--小沃-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1448604338444954.jpg" alt="咪咕">
				    </div>
  					</div><!--咪咕-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1448604384970211.jpg" alt="美图秀秀">
				    </div>
  					</div><!--美图秀秀-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447666760298019.jpg" alt="yy游戏">
				    </div>
  					</div><!--yy游戏-->
  					<div class="col-xs-4 col-sm-3 col-md-2">
				    <div class="thumbnail">
				      <img src="img/1447666933950076.jpg" alt="酷我音乐">
				    </div>
  					</div><!--酷我音乐-->
				</div>
			</div>
			<!--合作伙伴-->
		</section>
		<!--foot制作-->
		<footer class="public-footer">
			<div class="container">
			<div class="col-sm-6 col-md-8 footnote">
				<ul class="clearfix">
					<li><a href="#">公司简介</a></li>
					<li><a href="#">联系方式</a></li>
					<li><a href="#">人才招聘</a></li>
				</ul>
				<div class="copyright">All Copyright Reserved by Layabox Inc. 京ICP备15008163号-1 </div>
				</div>
				<div class="hidden-xs col-sm-6 col-md-4 friendshiplink">
					<a href="#" class="friendshiplink-email">
						<i class="iconfont icon-youjian1"></i>
						<div class="email"><img src="img/email.png"/></div>
					</a>
					<a href="#" class="friendshiplink-weixin">
						<i class="iconfont icon-weixin"></i>
						<div class="weixin"><img src="img/weixin.png"/></div>
					</a>
					<a href="#" class="friendshiplink-qqpop">
						<i class="iconfont icon-qq"></i>
						<div class="qqpop"><img src="img/qqpop.png"/></div>
					</a>
				</div>
			</div>
		</footer>
		<!--foot制作-->
	</body>
</html>